<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
    //  var star = "12222222222";
        /*
           双重for循环核心：外层一次，内层循环全部。
           内层循环：字符串追加了5个2
        */
    // for (var i = 0; i < i; i++){
    //   for (var j = 0; j < 5; j++){
    //      star = star + "2";
    //   }
    //  console.log(star);
    // }

        /*
         i = 0
         star = 122222
         i = 1
         star = 1222222222
         i = 2
         star = 1222222222222222
         */

        /*
               双重for循环:
                   1. 内层循环是外层循环的逻辑体的一部分
                   2. 外层循环一次，内层循环全部。
    
               语法结构：
                   for(初始化条件1; 判断条件1; 变化条件1;){  // 外层循环
                       逻辑体1;
                       for(初始化条件2; 判断条件2; 变化条件2;){  // 内层循环
                           逻辑体2;
                       }
                   }
        */

        /*
           4.打印倒三角，如下图
             *****
             ****
             ***
             **
             *
        number1(外层循环的次数，打印多少行) number2(内层循环的次数，每行打印几个)


        i    number2
        0    5
        1    4
        2    3
        3    2
        4    1

        i + number2 = 5
        number2 = 5 - i
         外层循环的次数，打印多少行
         内层循环的次数，每行打印几个
        */


        var number1 = 5;    // 外层循环的次数
        var number2 = 3;    // 内层循环的次数
        for (var i = 0; i < number1; i++){    // 外层循环
            var star = "";
            for (var j = 0; j < 5 - i; j++){   // 内层循环
            star = star + "*";
        }
        console.log(star);
    }
    // 外层控制了每行打印多少，内层控制了每行打印的个数
        // for (var i = 0; i < 5; i++) {  // 外层循环
        //     var star = "";
        //     for (var j = 0; j < 5; j++) {  // 内层循环
        //         star = star + "*";
        //     }
        //     console.log(star);
        // }

    </script>
</body>

</html>